<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<html>
<head>
    <meta charset="utf-8">
    <title>商品列表</title>
    <link rel="stylesheet" type="text/css" href="./css/style.css"/>
</head>
<body>
<c:if test="${empty user}">
    <jsp:forward page="login.jsp"></jsp:forward>
</c:if>

<div class="main" style="display: flex;flex-direction: column;align-items: center;">
    <h1 style="text-align: center;margin-bottom: 20px">商品列表</h1>
    <div class="content">
        <div class="header-container">
            <button onclick="javascript:location.href='add.jsp'">增加商品</button>
            <span class="search-container">
                <input type="text" name="name" value="${name}" class="txt" placeholder="请输入搜索关键字"/>
                <button onclick="search()">搜索</button>
            </span>
        </div>
        <div class="house-list">
            <c:forEach items="${list}" var="g">
            <div class="house-item">
                <a href="#" onclick="location.href='goodsServlet?method=info&id=${g.id}'"
                   target="_blank"><img src="./images/${g.goodsImg}" style="height: 250px"/></a>
                <p><a href="#" onclick="location.href='goodsServlet?method=info&id=${g.id}'"
                      target="_blank">[${g.goodsBrand}]${g.goodsName}</a></p>
                <div><span>${fn:substring(g.goodsDesc, 0, 17)}</span><span>数量： ${g.goodsSum}</span></div>
                <div><span class="price2" style="text-decoration: line-through">￥${g.goodsPrice}</span><span
                        class="price1">￥<fmt:formatNumber value="${g.goodsPrice * g.goodsDiscount}"
                                                          pattern="#,##0.00"/>
                        </span></div>
            </div>
        </c:forEach>
        </div>
        <hr />
        <div style="clear:both">&nbsp;</div>
        <div class="footer-container">
            <button style="margin-top: 20px" onclick="outLogin()">&nbsp;退出登陆</button>
            <ul class="pagination">
                <li><a href="#" onclick="location.href='goodsServlet?name=${name}&current=${current-1}'">«上页</a></li>
                <c:forEach begin="1" end="${pages}" var="i">
                    <li><a href="#" class="${current eq i ?'active':''}"
                           onclick="location.href='goodsServlet?name=${name}&current=${i}'">${i}</a></li>
                </c:forEach>
                <li><a onclick="location.href='goodsServlet?name=${name}&current=${current+1}'">下页»</a></li>
            </ul>
        </div>
    </div>
</div>
</body>
<style>
    .txt:focus {
        outline: none;
        border: 2px solid #65a0fa;
    }
</style>
<script src="js/jquery-1.12.2.js" type="text/javascript"></script>
<script>
    // 搜索
    function search() {
        window.location.href = "goodsServlet?name=" + $("[name='name']").val();
    }

    // 退出登陆
    function outLogin() {
        if (confirm("你确定要退出登陆吗？")) {
            window.location.href = "goodsServlet?method=out";
        }
    }
</script>
</html>

